<template>
  <div>
    <el-form  :rules="data.rules" :model="data">
      <el-form-item label="姓名" prop="name">
        <el-input v-model="data.name" placeholder="请输入姓名"></el-input>
      </el-form-item>
    </el-form>
  </div>
</template>
<script setup>
import {reactive,ref} from "vue";

const data = reactive({
  name:'',
  rules: {
    name: [
      { required: true, message: '请输入姓名', trigger: 'blur' },
      { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
    ]
  }
})



</script>
